import usePartState from "@module/usePartState";
import './styles.css'
import Pagination from '@ui/RJMart/pagination'

export default function Table(props) {
    const {isLogin,isSupp,unit,deptName,userName,items,status,sn,endDate,classification}=props.info
    const list=items;
    
    function showCorejishuItem() {
        let flag=false
        // console.log(classification,items)
        if((classification==4)||(classification==113)){
            if(items){
                for(let i=0;i<items.length;i++){
                    let item=items[i];
                    if(item.itemPropertyGroupCode=='SEQUENCING'){
                        flag=true;
                        break;
                    }
                }
            }
        }
        return flag;
    }
    const isShowCore=showCorejishuItem();
    // console.log(isShowCore)


    return(
        <div className="bid-detail-table-wrapper">
            <TableHeader
                info={props.info}
                isShowCore={isShowCore}
            />
            {
                list&&list.map((item,index)=>{
                    return(
                        <ListItem
                            key={index}
                            index={index}
                            item={item}
                            info={props.info}
                            isShowCore={isShowCore}
                        />
                    )
                })
            }
        </div>
    )

}


function TableHeader(props) {
    //status,4竞价中,8已取消,100已结束
    const {isLogin,isSupp,unit,deptName,userName,items,status,sn,endDate,classification,}=props.info;

    if(!isSupp&&(status==4 || status==100)){
        return(
            <div className={'bid-detail-table-header'}>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>序号</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>商品名称</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>品牌要求</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>货号要求</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>采购数量</p>
                <p className={'zen_w-p40 zen_t-c zen_opa6'}>采购要求</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>操作</p>
            </div>
            )
    }

    if(isLogin&& isSupp&& (status==4 || status==100)){

        return (
            <div className={'bid-detail-table-header'}>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>序号</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>商品名称</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>品牌要求</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>货号要求</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>采购数量</p>
                {
                    props.isShowCore?
                        <React.Fragment>
                            <p className={'zen_w-p30 zen_t-c zen_opa6'}>核心技术要求</p>
                            <p className={'zen_w-p30 zen_t-c zen_opa6'}>其他技术要求</p>
                        </React.Fragment>
                        :
                        <p className={'zen_w-p40 zen_t-c zen_opa6'}>采购要求</p>
                }

                <p className={'zen_w-p20 zen_t-c zen_opa6'}>报价</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>状态</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>操作</p>
            </div>
        )
    }
    if(status==8){
        return(
            <div className={'bid-detail-table-header'}>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>序号</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>商品名称</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>品牌要求</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>货号要求</p>
                <p className={'zen_w-p20 zen_t-c zen_opa6'}>采购数量</p>
                <p className={'zen_w-p40 zen_t-c zen_opa6'}>采购要求</p>
            </div>
        )
    }
    return null;
}


function ListItem(props) {

    const {isLogin,isSupp,status,unit,deptName,userName,items,sn,endDate,classification}=props.info;
    const {itemName,brand,itemNo,count,information,price,id,coreTechnologyRequirement,otherTechnologyRequirement,itemPropertyGroupCode}=props.item||{}
    const itemStatus=props.item.status;
    const statusTxt=showTxt(itemStatus);

   

    if(!isSupp&&(status==4 || status==100)){
        return(
            <div className={'bid-detail-item'}>
                <p className={'zen_w-p20 zen_t-c '}>{props.index+1}</p>
                <p className={'zen_w-p20 zen_t-c '}>{itemName}</p>
                <p className={'zen_w-p20 zen_t-c '}>{brand||'-'}</p>
                <p className={'zen_w-p20 zen_t-c '}>{itemNo||'-'}</p>
                <p className={'zen_w-p20 zen_t-c '}>{count}</p>
                <p className={'zen_w-p40 zen_t-c '}>{information||'-'}</p>
                <p
                    onClick={()=>{
                        $state.go({
                            stateName: "/bidDetailInfo",
                            params: {
                                id:id,
                                unitId:$state.params&&$state.params.id
                            }
                        })
                    }}
                    className={'zen_w-p20 zen_t-c zen_0093EB zen_cur-p'}>查看</p>
            </div>
         )
    }

    if(isLogin&& isSupp&& (status==4 || status==100)){
        return(
            <div className={'bid-detail-item'}>
                <p className={'zen_w-p20 zen_t-c '}>{props.index+1}</p>
                <p className={'zen_w-p20 zen_t-c '}>{itemName}</p>
                <p className={'zen_w-p20 zen_t-c '}>{brand||'-'}</p>
                <p className={'zen_w-p20 zen_t-c '}>{itemNo||'-'}</p>
                <p className={'zen_w-p20 zen_t-c '}>{count}</p>
                {
                    props.isShowCore?
                        <Requirement
                            coreTechnologyRequirement={coreTechnologyRequirement}
                            otherTechnologyRequirement={otherTechnologyRequirement}
                        />
                        :
                        <p className={'zen_w-p40 zen_t-c '}>{information||'-'}</p>
                }
                <p className={'zen_w-p20 zen_t-c '}>{(itemStatus==0||itemStatus==2)? price:'-'}</p>
                <p className={statusTxt? 'zen_w-p20 zen_t-c zen_0093EB':'zen_w-p20 zen_t-c'}>{statusTxt}</p>
                <p
                    onClick={()=>{
                        $state.go({
                            stateName: "/bidDetailInfo",
                            params: {
                                id:id,
                                unitId:$state.params&&$state.params.id
                            }
                        })
                    }}
                    className={'zen_w-p20 zen_t-c zen_0093EB zen_cur-p'}>查看</p>
            </div>
        )
    }

    return(
        <div className={'bid-detail-item'}>
            <p className={'zen_w-p20 zen_t-c '}>{props.index+1}</p>
            <p className={'zen_w-p20 zen_t-c '}>{itemName}</p>
            <p className={'zen_w-p20 zen_t-c '}>{brand||'-'}</p>
            <p className={'zen_w-p20 zen_t-c '}>{itemNo||'-'}</p>
            <p className={'zen_w-p20 zen_t-c '}>{count}</p>
            <p className={'zen_w-p40 zen_t-c '}>{information||'-'}</p>
        </div>
    )

    function showTxt(status){
        switch (status) {
            case 0:
                return '已报价';
                break;
            case 1:
                return '已放弃';
                break;
            case 2:
                return '已报价';
                break;
            case 3:
                return '未报价';
                break;
            default:
                return '未报价';
        }
    }
}


function Requirement(props) {
    const {coreTechnologyRequirement,otherTechnologyRequirement}=props;
    let replaceStr='/n';
    let coreTechnologyArr=[];
    let otherTechnologyArr=[];
    if(coreTechnologyRequirement){
        coreTechnologyArr=coreTechnologyRequirement.split(replaceStr);
    }
    if(otherTechnologyArr){
        otherTechnologyArr=otherTechnologyRequirement.split(replaceStr);
    }
    // console.log(coreTechnologyArr,otherTechnologyArr)

    return(
        <React.Fragment>
            <p className={'zen_w-p30 '}>
                {
                    coreTechnologyArr.map((item,idx)=>{
                        return(
                            <p key={idx} className={item?'':'zen_t-c'}>{item}</p>
                        )
                    })
                }
                {
                    coreTechnologyArr&&coreTechnologyArr.length==0&&(
                        <p className={'zen_t-c'}>{'-'}</p>
                    )
                }
            </p>
            <p className={'zen_w-p30 '}>
                {
                    otherTechnologyArr.map((item,idx)=>{
                        return(
                            <p key={idx} className={item?'':'zen_t-c'}>{item||'-'}</p>
                        )
                    })
                }
                {
                    otherTechnologyArr&&otherTechnologyArr.length==0&&(
                        <p className={'zen_t-c'}>{'-'}</p>
                    )
                }
            </p>
        </React.Fragment>


    )
}